<template>
	<view class="u-content">
		<view class="list" v-for="(item,index) in problemList" :key="index">
			<view class="title">
				<view class="indexbox">
					<view class="index">
						{{index+1}}
					</view>
				</view>
				
				<view class="titletext">
					{{item.QUESTION}}
				</view>
			</view>
			<view class="cont">
				{{item.ANSWER}}
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		data() {
			return{
				itemCode: '',
				problemList: []
			}
		},
		onLoad(option){
			this.itemCode = option.itemCode;
			this.selectItemDetail();
		},
		methods:{
			selectItemDetail(){
				uni.showLoading({
					title: '搜索中...',
					mask: true
				});
				this.$ajax({
					url: '/api/wwwBiz/selectItemDetail',
					method: 'POST',
					data:{
						itemCode:this.itemCode
					}
				}).then(res =>{
					if (res.code == 200) {
							this.problemList = res.data.data10;
						}
					}).finally(()=>{
					uni.hideLoading();
				})
			}
		}
	}
</script> 

<style scoped lang="scss">
	.u-content{
		width: 100%;
		height: 100%;
		overflow: hidden;
		.list{
			margin: 40rpx 53rpx;
			.title{
				width: 100%;
				height: 100%;
				display: flex;
				align-items: top;
				.indexbox{
					.index{
						width: 35rpx;
						height: 35rpx;
						background-color: #5b96ff;
						font-size: 24rpx;
						line-height: 48rpx;
						color: #ffffff;
						border-radius: 50%;
						display: flex;
						justify-content: center;
						align-items: center;
					}
				}
				
				.titletext{
					font-size: 28rpx;
					line-height: 48rpx;
					color: #5b96ff;
					margin-left: 20rpx;
				}
			}
			.cont{
					margin: 26rpx 46rpx;
					font-size: 28rpx;
					line-height: 48rpx;
					color: #333333;
			}
		}
	}
</style>
